<template>
  <div>
    <!-- <Comp :num="fatherNum" :obj="obj" @add="add"/> -->

    <!-- 作业： 表格组件封装  -->
    <!-- <tableInfo :titles="titles" :info="info" :total="totalPrice" @del="del" @search="search" @showall="showAll" /> -->

    <!-- 学生系统 -->
    <studentManager />
  </div>
</template>

<script>
  // 例子都在components里面，看哪个就换数字即可！
  import Comp from '@/components_2/Comp5.vue'
  import tableInfo from '@/components/tableInfo.vue'
  import studentManager from '@/components/studentManager.vue'
  export default {
    name: 'Home',
    components: {
      Comp,
      tableInfo,
      studentManager
    },
    data() {
      return {
        fatherNum: 10,
        obj: {
          name: 'haha'
        },
        //tableInfo表格相关数据
        titles: ["ID", "主标题", "起步价格", "操作"],
        info: [{
          "id": 287,
          "title": "严选新式样板间",
          "price_info": 29.9,
          "is_show": true
        }, {
          "id": 286,
          "title": "无“油”无虑的甜蜜酥脆",
          "price_info": 45,
          "is_show": true
        }, {
          "id": 283,
          "title": "孩子成长中少不了的一双鞋",
          "price_info": 78,
          "is_show": true
        }, {
          "id": 282,
          "title": "成就一室笋香1",
          "price_info": 121,
          "is_show": true
        }, {
          "id": 281,
          "title": "条纹新风尚",
          "price_info": 29,
          "is_show": true
        }, {
          "id": 277,
          "title": "治愈生活的满怀柔软",
          "price_info": 66.78,

          "is_show": true
        }, {
          "id": 274,
          "title": "没有软木拖，怎么过夏天",
          "price_info": 50.99,
          "is_show": true
        }, {
          "id": 272,
          "title": "料理也要精细简单",
          "price_info": 69,
          "is_show": true
        }, {
          "id": 271,
          "title": "选式新懒人",
          "price_info": 15.3,
          "is_show": true
        }, {
          "id": 268,
          "title": "米饭好吃的秘诀：会呼吸的锅",
          "price_info": 20.1,
          "is_show": true
        }]
      }
    },
    methods: {
      add(val) {
        this.fatherNum += val
      },

      // 表格组件相关功能函数
      // 删除某个
      del(index) {
        this.info.splice(index, 1)
      },
      //搜索
      search(val) {
        this.info.forEach(item => {
          if (item.title.indexOf(val) == -1) {
            item.is_show = false
          }
        })
      },
      //显示全部
      showAll() {
        this.info.forEach(item => {
          item.is_show = true
        })
      }
    },
    computed: {
      //总价
      totalPrice() {
        return this.info.reduce((prev, current) => {
          if (current.is_show) {
            return prev + current.price_info
          } else {
            return prev + 0
          }

        }, 0)
      }
    }

  }
</script>

<style scoped>

</style>